import React, { useEffect, useState } from "react";
import store from "../../redux/store";
import { increAction, decreAction, asyncIncreAction } from "../../redux/reducers/CountReducer";
import { addAction, subAction } from "../../redux/reducers/zanReducer";

export default function ReduxCom() {
  //声明 add 函数
  let add = () => {
    //调用
    store.dispatch(increAction(5));
  };

  //声明 sub 函数
  let sub = () => {
    store.dispatch(decreAction(3));
  };

  return (
    <div>
      <h2>{store.getState().count}</h2>
      <hr />
      <button onClick={add}>新增</button>
      <button onClick={sub}>减少</button>
      <button
        onClick={() => {
          store.dispatch(asyncIncreAction(10));
        }}
      >
        2秒之后 +1
      </button>

      <hr />
      <h2>点赞数: {store.getState().zan}</h2>
      <button onClick={() => {
        store.dispatch(addAction());
      }}>点赞</button>
      <button onClick={() => {
        store.dispatch(subAction());
      }}>取消</button>
    </div>
  );
}
